<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('添加公示公告')"/>
    <th:block th:include="include :: select2-css"/>
    <th:block th:include="include :: bootstrap-fileinput-css"/>
    <th:block th:include="include :: summernote-css"/>
</head>
<body>
<form class="form-horizontal m" id="form-notice-add">
    <div class="col-md-12">
        <div class="form-group">
            <label class="col-sm-3 control-label">标题：</label>
            <div class="col-sm-9">
                <input class="form-control required" type="text" id="title">
            </div>
        </div>

        <div class="form-group">
            <label class="col-sm-3 control-label">描述：</label>
            <div class="col-sm-9">
                <textarea class="form-control" id="description" rows="3" style="resize:none"></textarea>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">上传预览图：</label>
            <div class="col-sm-3" id="imgPath">
                <input id="file-Portrait1" type="file" name="preview" multiple/>
            </div>
        </div>

        <div class="form-group">
            <label class="col-sm-3 control-label">公示公告内容：</label>
            <div class="col-sm-9">
                <div class="ibox float-e-margins">
                    <div class="ibox-content no-padding">
                        <div class="summernote required" id="content">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</form>
<th:block th:include="include :: footer"/>
<th:block th:include="include :: select2-js"/>
<th:block th:include="include :: bootstrap-fileinput-js"/>
<th:block th:include="include :: summernote-js"/>
<script>
    var prefix = ctx + "system/touchscreen/notice";
    var imgPath;
    $(document).ready(function () {
        var control = $('#file-Portrait1');
        control.fileinput({
            language: 'zh', //设置语言
            uploadUrl: prefix + "/uploadImg",
            theme: "fa",
            height: 100,
            width: 100,
            maxFileCount: 1,
            allowedFileExtensions: ['jpg', 'png', 'gif'],//接收的文件后缀
            showUpload: true, //是否显示上传按钮
            showCaption: false,//是否显示标题
            showRemove: false,
            autoReplace: false,
            uploadAsync: true,
            showClose: false,
            browseOnZoneClick: true,
        }).on("fileuploaded", function (e, data) {
            var res = data.response;
            imgPath = res.path;
        });
        $('.summernote').summernote({
            lang: 'zh-CN',
            height: 300,
            minHeight: null,
            maxHeight: null,
        });
    });
    $("#form-notice-add").validate({
        onkeyup: false,
        rules: {
            title: {
                minlength: 1,
            },
        },
        focusCleanup: true
    });

    function submitHandler() {
        if ($.validate.form()) {
            var title = $('#title').val();
            var description = $('#description').val();
            var content = $('#content').summernote('code');
            if (description != null && description.length > 0 && content.length > 0) {
                var data = $("#form-notice-add").serializeArray();
                console.log(description);
                data.push({"name": "title", "value": title});
                data.push({"name": "description", "value": description});
                data.push({"name": "content", "value": content});
                data.push({"name": "imgPath", "value": imgPath});
                $.operate.save(prefix + "/add", data);
            } else {
                alert('请填写描述或内容');
            }
        }
    }
</script>
</body>
</html>
